{extend name="common/base" /}
{block name="body"}
<div class="soye-hui">
    <div class="souye-mains">
        <div id="pullrefresh" class="mui-content mui-scroll-wrapper " >
            <div class="mui-scroll">
                <div class="">
                    <div class="mui-slider souye-banner">
                        <div class="mui-slider-group mui-slider-loop" >
                            <!--支持循环，需要重复图片节点-->
                            {notempty name="endImg"}
                            <div class="mui-slider-item mui-slider-item-duplicate "><a href="{$endImg.ad_link}"><img src="__CDN__{$endImg.ad_img}" /></a></div>
                            {/notempty}
                             {notempty name="bannerList"}
                            {volist name="bannerList" id="vo"}
                            <div class="mui-slider-item"><a href="{$vo.ad_link}"><img src="__CDN__{$vo.ad_img}" /></a></div>
                            {/volist}
                            {/notempty}
                            <!--支持循环，需要重复图片节点-->
                            {notempty name="firstImg"}
                            <div class="mui-slider-item mui-slider-item-duplicate"><a href="{$firstImg.ad_link}"><img src="__CDN__{$firstImg.ad_img}" /></a></div>
                            {/notempty}
                        </div>
                    </div>
                    <!--<img src="__PUBLIC__/html/img/tu1.jpg">-->
                </div>
                <!--数据列表-->
                <ul class=" souye-nav mui-table-view mui-table-view-chevron">
                    {volist name="list" id="vo"}

                    <li>
                        <input type="hidden" name="task_id" class="js-tosk-ids" value="{$vo.task_id}" duration="{$vo.duration}" />
                        <a href="{:url('index/detail',['task_id'=>$vo['task_id']])}" style="display: block;">

                            <div class="nav-list">
                                <img src="__CDN__{$vo.xg_img[0]}">
                                <div class="nav-wz-dw">
                                    <p class="p1">¥{$vo.task_price}</p>
                                    <p class="p2"><i class="js-time-{$vo.task_id}">{$vo.get_time}</i>失效</p>
                                </div>
                            </div>
                            <p class="nav-list-ps">{$vo.task_title}</p>
                                                    </a>

                            <div class="nav-list-dib">
                                <div class="dib-span">
                                    <?php foreach($vo['push_position'] as $val):?>
                                    <span class="span-one">{$val}</span>
                                    <?php endforeach;?>
                                    <span class="span-one span-one2">展示{$vo.show_time}周</span>
                                </div>
                                <div class="bid-ps">剩<i>{$vo.task_num}</i>个名额</div>
                            </div>

                    </li>

                    {/volist}
                </ul>
            </div>
        </div>
    </div>
</div>
{/block}
{block name="script"}
<script type="text/javascript">
    mui.init({
        pullRefresh: {
            container: '#pullrefresh',
//            down: {
//                callback: pulldownRefresh
//            },
            up: {
                height: 50, //可选.默认50.触发上拉加载拖动距离
                auto: false, //可选,默认false.自动上拉加载一次
                contentrefresh: '正在加载...',
                contentnomore: '没有更多数据了', //可选，请求完毕若没有更多数据时显示的提醒内容；
                callback: pullupRefresh
            }
        }

    });
    var gallery = mui('.mui-slider');
    gallery.slider({
        interval: 5000//自动轮播周期，若为0则不自动播放，默认为0；
    });
    /**
     * 下拉刷新具体业务实现
     */
    function pulldownRefresh() {
        setTimeout(function () {
            var table = document.body.querySelector('.mui-table-view');
            var cells = document.body.querySelectorAll('.mui-table-view-cell');
            for (var i = cells.length, len = i + 3; i < len; i++) {
                var li = document.createElement('li');
                li.className = 'mui-table-view-cell';
                li.innerHTML = '<a class="mui-navigate-right">Item ' + (i + 1) + '</a>';
                //下拉刷新，新纪录插到最前面；
                table.insertBefore(li, table.firstChild);
            }
            mui('#pullrefresh').pullRefresh().endPulldownToRefresh(); //refresh completed
        }, 1500);
    }
    var p = 1;
    /**
     * 上拉加载具体业务实现
     */
    function pullupRefresh() {
        setTimeout(function () {
//            $(".souye-nav").append("<li><div class='nav-list'><img src='__PUBLIC__/html/img//tu1.jpg'><div class='nav-wz-dw'><p class='p1'>¥200.00</p><p class='p2'>3天15时23分后失效</p></div></div><p class='nav-list-ps'>任务名称任务名称任务名称任务名称任务名称任务名任任务名称</p><div class='nav-list-dib'><div class='dib-span'><span class='span-one'>侧面</span><span class='span-one'>背面</span><span class='span-one span-one2'>展示三周</span></div><div class='bid-ps'>剩<i>32</i>个名额</div></div></li>  ");

            $.post("{:url('Index/item')}", {p: p}, function (res) {
                if (res) {
                    $(".souye-nav").append(res);
                    p++;
//                                        mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);

//                    location.href = res.url;
                } else {
                    mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
//                    mui.toast(res.msg);
                }
            }, 'json');

//            mui('#pullrefresh').pullRefresh().endPullupToRefresh((++count > 2)); //参数为true代表没有更多数据了。
//            var table = document.body.querySelector('.mui-table-view');
//            var cells = document.body.querySelectorAll('.mui-table-view-cell');
//            for (var i = cells.length, len = i + 5; i < len; i++) {
//                var li = document.createElement('li');
//                li.className = 'mui-table-view-cell';
//                li.innerHTML = '<a class="mui-navigate-right">Item ' + (i + 1) + '</a>';
//                table.appendChild(li);
//            }
        }, 1500);
    }
    mui('body').on('tap', 'a', function () {
        window.top.location.href = this.href;
    });

    $(function () {
//        $('.js-tosk-ids').each(function(){
//            var task_id = $(this).val()
//            var times = $(this).attr('duration');
//            countDown(times,task_id);
//        });

    });

    //带天数的倒计时
    function countDown(times, task_id) {
        var timer = {};
        timer = setInterval(function () {
            var day = 0,
                    hour = 0,
                    minute = 0,
                    second = 0;//时间默认值
            if (times > 0) {
                day = Math.floor(times / (60 * 60 * 24));
                hour = Math.floor(times / (60 * 60)) - (day * 24);
                minute = Math.floor(times / 60) - (day * 24 * 60) - (hour * 60);
                second = Math.floor(times) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
            }
            if (day <= 9)
                day = '0' + day;
            if (hour <= 9)
                hour = '0' + hour;
            if (minute <= 9)
                minute = '0' + minute;
            if (second <= 9)
                second = '0' + second;
            $('.js-time-' + task_id).text(day + "天:" + hour + "时" + minute + "分")
            times--;
        }, 1000);
        if (times <= 0) {
            clearInterval(timer);
        }
    }
</script>
{/block}